<!-- 支持 -->
<template>
  <div class="like-container">
      <div class="row" v-for="item in 5" :key="item">
           <img src="@/images/3.png" alt="" width="60px" height="60px" 
           style="border-radius:50%;" id="face">
           <img src="@/images/3.png" alt="" width="60px" height="60px" id="photo" >
           <div class="con">
               <div class="left-con">
                   <span>jiaiji</span><span>打赏了</span>
                    <span>你的作品</span>
               </div>
               <div class="right-con">
                   
                   <span>1月30日</span>
               </div>
           </div>
      </div>
  </div>
</template>

<script>
export default {
  data () {
    return {
    };
  },

  methods: {}
}

</script>
<style lang='scss' scoped>
.row{
    position: relative;
    height: 100px;
    width:100%;
    margin-top:20px;
    background-color:#EBEEF5;
    #face{
        position: absolute;
        top:20px;
        left:20px;
    }
    #photo{
        position: absolute;
        top:20px;
        right:150px;
    }
    .con{
        display: flex;
        justify-content: space-between;
        align-items: center;
        height: 100%;
        .left-con{
            margin-left:100px;
             font-size:18px;
            letter-spacing: 5px;
        }
        .right-con{
            margin-right:50px;
            font-size:16px;
                letter-spacing: 3px;
                color:#909399;
        }
    }
}
</style>